<script setup lang="ts">

</script>

<template>
  <div class="common-box">
    <div class="left">
      <div class="icon">
        <slot></slot>
      </div>
    </div>
    <div class="right">
      <div class="title">
        <slot name="title"></slot>
      </div>
      <div class="content">
        <slot name="content"></slot>
      </div>
    </div>
  </div>
</template>
<style scoped lang="scss">
.common-box{
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(249, 250, 251);
  padding: 20px;
  .icon{
    font-size: 25px;
    margin-right: 10px;
  }
  .content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
</style>